@extends('layouts.empty')

@section('css')
<style>
  .good-tag {
  position: relative;
  box-sizing: border-box;
  width: 40mm;
  height: 50mm;
  border: 1px solid #000;
  page-break-after: always;
}
.good-tag-body {
  position: absolute;
  top: 2mm;
  left: 3mm;
  width: 34mm;
  height: 28mm;
}
.good-tag-body__qrcode {
  position: absolute;
  top: 0;
  left: 0;
  width: 28mm;
  height: 28mm;
}
.good-tag-body__type {
  position: absolute;
  top: 0;
  right: 0;
  width: 6mm;
  height: 28mm;
  text-align: center;
}
.good-tag-footer {
  position: absolute;
  bottom: 2mm;
  left: 3mm;
  width: 34mm;
  height: 16mm;
}
.good-tag-footer__name,
.good-tag-footer__spec,
.good-tag-footer__time {
  font-size: 3mm;
  line-height: 5mm;
  overflow: hidden;
  height: 5mm;
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.none{
  display: none;
}
</style>
@endsection

@section('content')
  <div class="panel"></div>
@endsection

@section('scripts')
    <div id="tag" class="good-tag none">
      <div class="good-tag-body">
        <div class="good-tag-body__qrcode"></div>
        <div class="good-tag-body__type"></div>
      </div>
      <div class="good-tag-footer">
        <div class="good-tag-footer__name"></div>
        <div class="good-tag-footer__spec"></div>
        <div class="good-tag-footer__time"></div>
      </div>
    </div>
    <script>
    function fetchPrint() {
      $.get('https://nihaocai.zkong.me/api/orders', { is_fresh_print: 0,not_checklogin:1,is_print:1 }, (res) => {
          const raw = res.data.filter(order => order.goods.some(good => good.goods.is_timely_sort === 1));
          const result = [];
          raw.forEach(order => order.goods.filter(good => good.goods.is_timely_sort===1).forEach(good => result.push({
            orderId:order.id,
            goodId: good.goods.id,
            attributeId: good.attribute?good.attribute.id:null,
            customer:order.address.name,
            time:order.will_take?'自提':order.shipping_at.substr(11,5),
            name:good.goods.name,
            spec:good.attribute?good.attribute.name:good.goods.title,
            number:good.number
          })))
          const printResult = [];
          const ids = result.map(item => item.orderId);
          console.log(ids);
          result.forEach((item) => {
            for (let i = 0; i < item.number; i += 1) {
              printResult.push({ type: '客户联', ...item });
              printResult.push({ type: '留存联', ...item });
            }
          });
          const $panel = $('.panel');
          printResult.forEach(item=>{
            const $tag = $('#tag').clone().removeClass('none');
            $tag.find('.good-tag-body__qrcode').html('').qrcode({width: 103,height: 103,text: `goodId=${item.goodId}&attributeId=${item.attributeId}`})
            $tag.find('.good-tag-body__type').html(item.type);
            $tag.find('.good-tag-footer__name').html(item.name);
            $tag.find('.good-tag-footer__spec').html(item.spec);
            $tag.find('.good-tag-footer__time').html(`${item.time} ${item.customer}`);
            $panel.append($tag);
          });
          const length = $('.panel').find('.good-tag').length;
          if(length > 0) {
            window.print();
            $.post('https://nihaocai.zkong.me/api/order/set_fresh_print_state',{ids: JSON.stringify(ids)});
          }
        });
    }
    $(() => {
      fetchPrint();
      setTimeout(()=>{
        document.location.reload(true);
      },900000);
      
    });
    </script>
@endsection